<!--
 作者 : 唐梓元
 日期 : 2019-9-6
 版本 : 1.0
 描述 :错误或者提醒弹出框 toast
 使用 :    this.$confirm({
                icon:'ok',//是否显示图标，不需要就不写icon字段
                msg:'收藏成功！'//toast文字提示内容

 -->
<template>
  <div class="toastWrapper f-zhong" v-if="toastShow">
    <div class="toast">
      <div class="icon f-zhong" v-if="text.icon"><img src="../assets/gouxuan201996.png" alt=""></div>
      <div class="text f-zhong">{{text.msg}}</div>
    </div>
  </div>
</template>

<script>
    export default {
        name: "cm_toast",
      data(){
          return{
            toastShow:true,
            text:{
              icon:true,
              msg:'提示信息'
            }
          }
      }
    }
</script>

<style scoped>
  .toastWrapper{
    position: fixed;
    width: 100%;
    top: 0;
    bottom: 0;
  }
  .toast{
    padding:0 10px 10px;
    background-color: rgba(0,0,0,0.7);
    color: white;
    margin-top: -100px;
    border-radius: 5px;
    min-width: 90px;
    min-height: 40px;
  }
  .toast>.icon>img{
    width: 70px;
  }
  .text{
    color: white;
    max-width: 100px;
    padding-top: 10px;
  }
</style>
